<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="UTF-8" />
		<meta name="viewport" content="width=device-width, initial-scale=1.0" />
		<title>Document</title>
	</head>
	<body></body>
	<script>
		let obj = {
			tag: "div",
			children: [
				{
					tag: "span",
					children: "hello world",
				},
			],
		};
		function Render(obj, root) {
			const el = document.createElement(obj.tag);
			if (typeof obj.children === "string") {
				const text = document.createTextNode(obj.children);
				el.appendChild(text);
			} else if (obj.children) {
				obj.children.forEach((child) => Render(child, el));
			}
			root.appendChild(el);
		}
		Render(obj, document.body);
	</script>
</html>
